﻿@using RuoVea.ExUtil;

@using Microsoft.Extensions.Options

@{
    ViewData["Title"] = "作业";
    string JobRootUrl = "";
    Layout = "";
}
<!DOCTYPE html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>@ViewData["Title"] - MES管理系统</title>
    <link href="/elementui/index.css" rel="stylesheet" />
    <link href="/elementui/index.extend.css?v=22" rel="stylesheet" />
    <style scoped>


    </style>
</head>
<body>
    <div id="main" v-cloak>
        <el-button type="primary" v-bind:size="buttonSize" icon="el-icon-plus" @@click="addDialogForm">新建任务</el-button>
        <el-button type="default" v-bind:size="buttonSize" icon="el-icon-view" @@click="addDialogForm(false)">查看</el-button>

        <el-dialog v-bind:title="dialogTitle" v-bind:visible.sync="dialogVisible">
            <slot id="#body"></slot>
            <el-form :model="dialogForm" :rules="dialogRules" ref="dialogForm" size="small" label-width="8em">
                <el-row>
                    <el-col :span="12">
                        <el-form-item prop="jobName" label="任务名称">
                            <el-input v-model="dialogForm.jobName" autocomplete="off" placeholder="请输入内容"></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="12">
                        <el-form-item prop="jobGroup" label="任务分组">
                            <el-select v-model="dialogForm.jobGroup" placeholder="请选择任务分组">
                                <el-option key="default" label="默认" value="default"></el-option>
                                <el-option key="dev" label="开发区" value="dev"></el-option>
                                <el-option key="test" label="测试区" value="test"></el-option>
                                <el-option key="verify" label="验证区" value="verify"></el-option>
                                <el-option key="official" label="正式区" value="official"></el-option>
                            </el-select>
                            @* <el-input v-model="dialogForm.jobGroup" placeholder="请输入内容" autocomplete="off"></el-input> *@
                        </el-form-item>
                    </el-col>
                    <el-col :span="12">
                        <el-form-item prop="beginTime" label="开始日期">
                            <el-date-picker type="datetime" placeholder="开始日期" v-model="dialogForm.beginTime" style="width: 100%;"></el-date-picker>
                        </el-form-item>
                    </el-col>
                    <el-col :span="12">
                        <el-form-item prop="endTime" label="结束时间">
                            <el-date-picker type="datetime" placeholder="结束时间" v-model="dialogForm.endTime" style="width: 100%;"></el-date-picker>
                        </el-form-item>
                    </el-col>



                    <el-col :span="12" v-if="dialogForm.triggerType==1">
                        <el-form-item prop="cron" label="Cron">
                            <el-input v-model="dialogForm.cron" placeholder="请输入内容" autocomplete="off"></el-input>
                        </el-form-item>
                    </el-col>

                    <el-col :span="6" v-if="dialogForm.triggerType==0">
                        <el-form-item prop="intervalSecond" label="执行间隔/秒" label-width="8em">
                            <el-input v-model.number="dialogForm.intervalSecond" placeholder="执行间隔时间，单位秒（如果有Cron，则IntervalSecond失效）" autocomplete="off"></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="6" v-if="dialogForm.triggerType==0">
                        <el-form-item prop="runTimes" label="执行次数" label-width="6em">
                            <el-input v-model.number="dialogForm.runTimes" placeholder="执行次数(默认无限循环)" autocomplete="off"></el-input>
                        </el-form-item>
                    </el-col>


                    <el-col :span="12" v-if="dialogForm.runType==0">
                        <el-form-item prop="assemblyName" label="执行程序集"> <el-input v-model="dialogForm.assemblyName" placeholder="请输入执行程序集" autocomplete="off"></el-input> </el-form-item>
                    </el-col>
                    <el-col :span="12" v-if="dialogForm.runType==0">
                        <el-form-item prop="className" label="任务所在类">
                            <el-input v-model="dialogForm.className" placeholder="请输入内容" autocomplete="off"></el-input>
                        </el-form-item>
                    </el-col>

                    <el-col :span="18" v-if="dialogForm.runType>0">
                        <el-form-item prop="requestUrl" label="请求url">
                            <el-input v-model="dialogForm.requestUrl" placeholder="请输入内容" autocomplete="off"></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="18" v-if="dialogForm.runType>0">
                        <el-form-item prop="headers" label="Headers">
                            <el-input type="textarea" :rows="1" v-model="dialogForm.headers" placeholder="Headers(可以包含如：Authorization授权认证) 格式：{'Authorization':'userpassword..'}" autocomplete="off"></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="18" v-if="dialogForm.runType==2||dialogForm.runType==3">
                        <el-form-item prop="parameters" label="Parameters"> <el-input type="textarea" :rows="1" v-model="dialogForm.parameters" placeholder="请求参数（Post，Put请求用）{' Authorization':'userpassword..'}" autocomplete="off"></el-input> </el-form-item>
                    </el-col>

                    <el-col :span="18">
                        <el-form-item prop="mailMsgType" label="邮件通知">
                            <el-select v-model="dialogForm.mailMsgType" placeholder="请选择邮件通知类型">
                                <el-option label="不通知" :value="parseInt(0)"></el-option>
                                <el-option label="错误时通知" :value="parseInt(1)"></el-option>
                                <el-option label="成功时通知" :value="parseInt(2)"></el-option>
                                <el-option label="所有情况通知" :value="parseInt(3)"></el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :span="18" v-if="dialogForm.mailMsgType>0">
                        <el-form-item prop="sendMailers" label="通知邮箱">
                            <el-input type="textarea" :rows="1" v-model="dialogForm.sendMailers" placeholder="请输入邮箱内容,多个邮箱请使用逗号隔开" autocomplete="off"></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="18">
                        <el-form-item prop="horkMsgType" label="机器人通知">
                            <el-select v-model="dialogForm.horkMsgType" placeholder="请选择通知类型">
                                <el-option label="不通知" :value="parseInt(0)"></el-option>
                                <el-option label="错误时通知" :value="parseInt(1)"></el-option>
                                <el-option label="成功时通知" :value="parseInt(2)"></el-option>
                                <el-option label="所有情况通知" :value="parseInt(3)"></el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :span="18" v-if="dialogForm.horkMsgType>0">
                        <el-form-item prop="horkUrl" label="通知地址">
                            <el-input v-model="dialogForm.horkUrl" placeholder="请输入机器人地址" autocomplete="off"></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="18">
                        <el-form-item prop="description" label="任务描述">
                            <el-input type="textarea" :rows="2" v-model="dialogForm.description"></el-input>
                        </el-form-item>
                    </el-col>
                </el-row>
            </el-form>
            
            <div slot="footer" class="dialog-footer" v-bind:visible.sync="footerVisible">
                <el-button v-on:click="dialogVisible = false" v-bind:size="buttonSize">取消</el-button>
                <el-button type="primary" v-on:click="submitForm" v-bind:size="buttonSize">确定</el-button>
                <slot id="#footerButton"></slot>
            </div>
        </el-dialog>

    </div>

    <script type="text/javascript" src="/vue/vue.js?v=2.0"></script>
    <script type="text/javascript" src="/vue/vue-i18n.min.js?v=2.0"></script>
    <script type="text/javascript" src="/elementui/index.js"></script>
    <script type="text/javascript" src="/elementui/index.extend.js"></script>
    <script type="text/javascript" src="/vue/axios.min.js"></script>
    <script>

        var $taskVue = new Vue({
            el: "#main",
            data() {
                return {

                    buttonSize: "small",
                    dialogTitle: "计划任务",
                    dialogVisible: false,

                    footerVisible: false,

                    loading: false,


                    dialogForm: {
                        id: 0, schedName: '',
                        jobName: '', jobGroup: 'default',
                        beginTime: Date.parse('@(DateTime.Now.ToDateTimeString())'),
                        endTime: Date.parse('@(DateTime.MaxValue.ToDateTimeString())'),
                        cron: '', runTimes: 0, intervalSecond: 0, scheduleType: 0, triggerType: 0, runType: 1,
                        triggerState: 0, requestUrl: '', headers: '', parameters: '', description: '', mailMsgType: 0,
                        sendMailers: "", horkMsgType: 0, horkUrl: "", assemblyName: '', className: ''
                    },

                    dialogInitForm: {
                        id: 0, schedName: '', jobName: '', jobGroup: 'default',
                        beginTime: Date.parse('@(DateTime.Now.ToDateTimeString())'), endTime: Date.parse('@(DateTime.MaxValue.ToDateTimeString())'), cron: '',
                        runTimes: 0, intervalSecond: 0, scheduleType: 0, triggerType: 0, runType: 1, triggerState: 0, requestUrl: '', headers: '', parameters: '',
                        description: '', mailMsgType: 0, sendMailers: "", horkMsgType: 0, horkUrl: "", assemblyName: '', className: ''
                    },

                    dialogRules: {
                        jobName: [{ required: true, message: '请输入任务名称', trigger: 'blur' }, { min: 2, max: 50, message: '长度在 2 到 50 个字符', trigger: 'blur' }],
                        // jobGroup: [{ required: true, message: '请输入任务分组', trigger: 'blur' }, { min: 2, max: 50, message: '长度在 2 到 50 个字符', trigger: 'blur' }],
                        beginTime: [{ required: true, message: '请输入开始日期', trigger: 'change' }],
                        endTime: [{ required: true, message: '请输入结束时间', trigger: 'change' }],
                        cron: [{ required: true, message: '请输入Cron表达式', trigger: 'blur' }],
                        intervalSecond: [{ required: true, message: '请输入执行间隔/秒', trigger: 'blur' }, { type: 'number', message: '必须为数字值' }],
                        runTimes: [{ type: 'number', message: '必须为数字值' }],
                        requestUrl: [{ required: true, message: '请输入请求url', trigger: 'blur' }],
                        // headers: [{ required: true, message: '请输入Headers', trigger: 'blur' }],
                        // parameters: [{ required: true, message: '请输入Parameters', trigger: 'blur' }],
                        sendMailers: [{ required: true, message: '请输入通知邮箱', trigger: 'blur' }],
                        horkUrl: [{ required: true, message: '请输入机器人地址', trigger: 'blur' }],
                        assemblyName: [{ required: true, message: '请输入执行程序集', trigger: 'blur' }],
                        className: [{ required: true, message: '请输入任务所在类', trigger: 'blur' }],
                    },
                }
            },
            created() {
                // setInterval(() => { this.OnLoadJobs(); }, 10000);
            },
            mounted: function () {
                // this.OnLoadJobs();
            },
            methods: {
                submitForm() {
                    this.$refs.formRef.validate((valid) => {
                        if (valid) {
                            alert('表单验证成功!');
                            // 表单提交逻辑
                        } else {
                            console.error('表单验证失败!');
                            return false;
                        }
                    });
                },
                addDialogForm() {
                    var that = this;
                    that.dialogVisible = true; 
                    that.dialogForm = null;
                    that.dialogForm = that.dialogInitForm;
                },
                editDialogForm(index, row) {
                    var that = this;
                    that.dialogVisible = true;
                    that.dialogForm = that.dialogInitForm;
                    axios("@("/" + JobRootUrl + "/getjob/")" + row.id).then(function (res) { if (res.data.code == 200) { that.dialogForm = res.data.data; } });
                },
                submitForm() {
                    var that = this;
                    that.$refs["dialogForm"].validate((valid) => {
                        if (valid) {
                            axios.post("@("/" + JobRootUrl + "/jobsave")", that.dialogForm).then(function (res) {
                                if (res.data.code == 200) {
                                    ELEMENT.MessageBox.alert(res.data.message, "系统信息", { type: 'success', callback: () => { that.OnLoadJobs(); that.dialogForm = that.dialogInitForm; that.dialogFormVisible = false; } });
                                } else {
                                    ELEMENT.MessageBox.alert(res.data.message, "系统信息", { type: 'info', callback: () => { } });
                                }
                            });
                        }
                    });
                },

            },
            filters: {

            }
        });


        Vue.component('ElExtendBody', {
            props: {
                logoSrc: String,
                logoTitle: String,
                activeIndex: { type: String, },
                menuData: Array,
                userName: String,
                userAvatar: String,
                loginOutTxt: String,
                handleLogout: Function,
            },
            template: ``
        });
    </script>
</body>
</>
